const timeline = this.pageObj.getApiWidgetByAliasName('timeline-v2');
const timelineDetail = this.pageObj.getApiWidgetByAliasName('timeline-detail');
const subTabs = this.pageObj.getApiWidgetByAliasName('sub-tabs');
const eventReturn = this.pageObj.getApiWidgetByAliasName('event-return');

let option = timeline.widgetObj._option;
const com = { nowrap: true, overflow: 'ellipsis', type: "text" }

console.log($event, timeline, option)

// 使用纵向风格
option.duration = 'vertical';
// 时间轴模式
option.mode = 'timeline';
// 设置气泡三角位置
option.triangle = { direction: 'left', left: -20 };

eventReturn.hideWidget()

/**
 * @return {string}
 */
function format(timestamp) {
  var now = new Date(timestamp);
  var m = now.getMonth() + 1;
  var d = now.getDate();
  return (m < 10 ? "0" + m : m) + "-" + (d < 10 ? "0" + d : d) + " " + now.toTimeString().substr(0, 5);
}

const request = {
  fetch(url, option = {}) {
    const opt = {
      headers: {
        'Content-type': 'application/json;charset=UTF-8'
      },
      ...option,
    }
    return fetch(url, opt)
      .then(res => res.json())
      .then(({ success, result }) => {
        if (success) {
          console.log('---------------------> ', result.result);
          return result.result
        }
      })
  },
  get(url) {
    return request.fetch(url)
  },
  post(url, body = {}) {
    const opt = { method: 'POST', body: JSON.stringify({ pageNum: 1, pageSize: 100, ...body}) }
    return request.fetch(url, opt)
  },
}

let result;

if ($event === 'dynamic') { // 动态
  // 启用气泡
  option.bubble = { type: 'bubble' };
  // 设置内容显示配置
  option.config = [
    // 标题栏左边
    { ...com, column: 6, container: "title",  field: "receiveSystemName" },
    // 标题栏右边
    { ...com, column: 6, container: "title",  field: "taskEndTime", align: 'right' },

    // 气泡内部的 第一行
    { ...com, column: 12, container: "content",  field: "taskTypeName" },
    // 气泡内部的 第二行
    { ...com, column: 12, container: "content",  field: "taskTitle" },
  ];

  result = request.get('/SummaryAssessmentSV/emergencyRecord/queryEmergencyDynamicRecord').then((data) => {
    if (data) {
      return data.map((item, index) => ({
        ...item,
        receiveSystemName: item.receiveSystemName || `测试-${index}`,
        taskEndTime: format(item.taskEndTime),
      }));
    }
  })

  timeline.widgetObj.show({ top: 180 });
  timelineDetail.hideWidget();
  subTabs.hideWidget();
} else if ($event === 'task') { // 任务
  const row = { ...com, column: 9, container: "content", type: "object" }
  // 使用边框气泡
  option.bubble = { type: 'bubble-border' };
  // 设置气泡三角位置
  option.triangle = { direction: 'left', left: -25 };
  // 设置内容显示配置
  option.config = [
    { ...row, field: "taskTitle", label: "任务名称" },
    { ...row, field: "receiveSystemName", label: "任务接受方" },
    { ...row, field: "taskTime", label: "任务时间" },
    { ...row, field: "taskTypeName", label: "任务类型" },
    { ...row, field: "taskSite", label: "任务点位" },
    {
      ...row,
      field: "status",
      label: "任务状态",
      btns: [
        { name: '进度', offsetX: 5, offsetY: -1 },
        { name: '详情', offsetX: 5, offsetY: -50 },
      ]
    },
  ];

  result = request.post('/Event/task/page').then((data) => {
    if (data) {
      return data.map((item, index) => ({
        ...item,
        receiveSystemName: item.receiveSystemName || `测试-${index}`,
        taskTime: format(item.taskEndTime),
      }));
    }
  });

  timeline.widgetObj.show({ top: 200 });
  timelineDetail.hideWidget();
  subTabs.showWidget();
} else if ($event === 'progress') { // 进度
  // 启用气泡
  option.bubble = { type: 'bubble' };
  // 设置内容显示配置
  option.config = [
    // 标题栏左边
    { ...com, column: 4, container: "title",  field: "name" },
    // 标题栏中间
    { ...com, column: 4, container: "title",  field: "recordTime" },
    // 标题栏右边
    { ...com, column: 4, container: "title",  field: "value" },

    // 气泡内部的 第一行
    { ...com, column: 12, container: "content",  field: "value" },
    // 气泡内部的 第二行
    { ...com, column: 12, container: "content",  field: "content" },
  ];

  result = request.get('/SummaryAssessmentSV/emergencyRecord/queryEventStateProcessRecord').then((data) => {
    if (data) {
      return data.map((item, index) => ({
        ...item,
        receiveSystemName: item.receiveSystemName || `测试-${index}`,
        taskEndTime: format(item.taskEndTime),
      }));
    }
  })

  timeline.widgetObj.show({ top: 250 });
  subTabs.hideWidget();

  const subOpt = timelineDetail.widgetObj._option;

  // 使用纵向风格
  subOpt.duration = 'horizontal';
  subOpt.value = 'value';
  subOpt.point = { state: 'press', index: true };

  timelineDetail.widgetObj._option = subOpt;
  timelineDetail.widgetObj.show({ top: 190, height: 100 });
  timelineDetail.widgetObj.render();
}

if (result) {
  result.then(data => {
    if (data) {
      option.dataSource = data
      timeline.widgetObj._option = option
      timeline.widgetObj.render()
    }
  })
} else {
  timeline.widgetObj._option = option
  timeline.widgetObj.render()
}





